<template>
  <transition>
  <div class="report-order-list platform-report-list">
    <section class="app-main">

      <div class="app-fixed-top">
      <div class="app-header">
        <span class="type-show">客户类型：<span class="type-content">{{selectTypeName}}<template v-if="timeSelectStr!=='全部'">-{{timeSelectStr}}</template></span></span>
        <mt-button class="btn-filter" type="danger" @click="handleFilter">筛选</mt-button>
      </div>
        <mt-navbar v-model="selected">
          <mt-tab-item id="0">
            <span class="tab-item-content">未派单
              <span class="count" v-if="resCount.waitCount!==0">
                <template v-if="resCount.waitCount<100">{{resCount.waitCount}}</template>
                <span class="count-tips" v-else>...</span>
              </span>
          </span>
          </mt-tab-item>
          <mt-tab-item id="1">
            <span class="tab-item-content">已派单
              <span class="count" v-if="resCount.sendCount!==0">
                <template v-if="resCount.sendCount<100">{{resCount.sendCount}}</template>
                <span class="count-tips" v-else>...</span>
              </span>
            </span>
          </mt-tab-item>
          <mt-tab-item id="2"><span class="tab-item-content">已接单
            <span class="count" v-if="resCount.receiveCount!==0">
                <template v-if="resCount.receiveCount<100">{{resCount.receiveCount}}</template>
                <span class="count-tips" v-else>...</span>
            </span>
          </span></mt-tab-item>
          <mt-tab-item id="7"><span class="tab-item-content">申请取消<span class="count" v-if="resCount.cancelApplyCount!==0">{{resCount.cancelApplyCount}}</span></span></mt-tab-item>
          <mt-tab-item id="4"><span class="tab-item-content">已完成</span></mt-tab-item>
          <mt-tab-item id="6"><span class="tab-item-content">已取消</span></mt-tab-item>

        </mt-navbar>
      </div>
      <!-- tab-container -->
      <div class="tab-body xunjia-list">
        <ul class="tab-list"
            v-infinite-scroll="loadMore"
            infinite-scroll-disabled="loading"
            infinite-scroll-distance="10">
          <li v-if="selected=='7'">
            <mt-radio
              title=""
              class="block-time-select"
              v-model="selectCancelType"
              :options="optionsCancelType">
            </mt-radio>
          </li>
          <li v-if="selected=='2'">
            <mt-radio
              title=""
              class="block-time-select"
              v-model="selectTime"
              :options="optionsTimeSelect">
            </mt-radio>
          </li>
          <li class="item" v-for="item in enquiryList">
            <div class="item-header">
              {{item.applyCustomName}}<template v-if="!item.applyCustomName">{{item.applyCustomTypeName}}</template>
              <div class="item-sn">{{item.sn}}&nbsp;/&nbsp;内部单号:{{item.innerSn}}</div>
              <span class="item-state">
                <template>{{item.allotStatusDesc}}</template>
              </span>
            </div>
            <dl class="item-body" @click="handleDetails(item)">
              <dd><span class="item-addon">客户说明：</span><template v-if="item.applyCustomDesc">{{item.applyCustomDesc}}</template></dd>
              <dd><span class="item-addon">车牌号/自编号：</span>{{item.carNo}}<template v-if="item.carNo">/</template>{{item.selfNumber}}</dd>
              <dd><span class="item-addon">车&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;型：</span>{{item.carModel}}</dd>
              <dd v-if="selected=='0'"><span class="item-addon">创建时间：</span>{{item.createDateStr}}</dd>
              <dd v-if="selected=='6'"><span class="item-addon">取消时间：</span>{{item.cancelDateStr}}</dd>
              <dd v-if="selected=='1' || selected=='4'"><span class="item-addon">派单时间：</span>{{item.allotDateStr}}</dd>
              <dd v-if="selected=='2'"><span class="item-addon">接单时间：</span>{{item.receiveDateStr}}</dd>
              <dd v-if="selected=='4'"><span class="item-addon">完成时间：</span>{{item.finishDateStr}}</dd>
              <dd v-if="selected=='7'"><span class="item-addon">申请时间：</span>{{item.cancelApplyDateStr}}</dd>
              <dd><span class="item-addon"><span class="iconfont icon-didian1"></span>位&nbsp;&nbsp;置：</span>{{item.address}}</dd>
              <dd v-if="selected=='1'"><span class="item-addon">派单已用时：</span>
                <span class="time-content" v-if="item.timeStatusDiff<600000">{{getTime(item.timeStatusDiff)}}</span>
                <span class="time-content time-content-warning" v-if="item.timeStatusDiff>600000 && item.timeStatusDiff<900000">{{getTime(item.timeStatusDiff)}}</span>
                <span class="time-content time-content-danger" v-if="item.timeStatusDiff>900000">{{getTime(item.timeStatusDiff)}}</span>
              </dd>
              <dd v-if="selected=='2'">
                <span class="item-addon">接单已用时：</span>
                <span class="time-content" v-if="item.timeStatusDiff<600000">{{getTime(item.timeStatusDiff)}}</span>
                <span class="time-content time-content-warning" v-if="item.timeStatusDiff>600000 && item.timeStatusDiff<900000">{{getTime(item.timeStatusDiff)}}</span>
                <span class="time-content time-content-danger" v-if="item.timeStatusDiff>900000">{{getTime(item.timeStatusDiff)}}</span>
              </dd>
            </dl>
            <div class="item-footer">
              <mt-button type="danger" @click="handleDetails(item)">工单详情</mt-button>
            </div>
          </li>
        </ul>
        <div class="line-scale-pulse-out" v-show="loading">
          <div class="loader-item"></div>
          <div class="loader-item"></div>
          <div class="loader-item"></div>
          <div class="loader-item"></div>
          <div class="loader-item"></div>
        </div>
        <div class="module-none" v-if="showNone">
          暂无工单信息！
        </div>
        <!--<div class="load-finish-tips" v-if="loadTips">-->
        <!--已加载完成-->
        <!--</div>-->
      </div>
    </section>

    <!--弹窗-列表筛选-->
    <mt-popup
      v-model="popupFilterShow"
      position="right" class="filter-popup">
      <ul class="filter-list">
        <li class="filter-item">
          <span class="addon">客户类型</span>
          <mt-radio
            title=""
            v-model="selectType"
            :options="optionsCustomer">
          </mt-radio>
        </li>
        <li class="filter-item">
          <span class="addon">条件搜索</span>
        </li>
        <li class="filter-item filter-item-spe">
          <mt-field label="客户名称" placeholder="" v-model="search.applyCustomName"></mt-field>
        </li>
        <li class="filter-item filter-item-spe">
          <mt-field label="工单号/内部单号" placeholder="" v-model="search.sn"></mt-field>
        </li>
        <li class="filter-item filter-item-spe">
          <mt-field label="车牌号/自编号" placeholder="" v-model="search.carNo"></mt-field>
        </li>
        <li class="filter-item filter-item-spe">
          <mt-field label="服务内容" placeholder="" v-model="search.remark"></mt-field>
        </li>
        <li class="filter-item filter-item-spe filter-item-select">
          <!--<mt-field label="派单员" placeholder="" v-model="search.allotUserName"></mt-field>-->
          <mt-cell
            title="操作员" class="mint-field">
            <select v-model="search.operatorId" class="select-operator">
              <option value="">全部操作员</option>
              <option v-for="item in allotAttr" :value="item.id">{{item.name}}</option>
            </select>
          </mt-cell>
        </li>
      </ul>
      <div class="button-content">
        <div class="button-block-6">
          <mt-button type="default" @click="popupFilterShow=false">取消</mt-button>
        </div>
        <div class="button-block-6">
          <mt-button type="danger" @click="handleSure">确认</mt-button>
        </div>
      </div>
    </mt-popup>
    <!--弹窗-列表筛选-->
  </div>
    </transition>
</template>

<script>
  import { Navbar, TabItem,TabContainer, TabContainerItem,Button,Radio,Toast,Indicator} from 'mint-ui';

//  Vue.component(Header.name, Header);
export default {
  data () {
    return {
      endDate:new Date(),
      selected:'',
      shopKeeper:'',
      res:'',
      resCount:'',
      timeSelectStr:'',
      showNone:false,
      loading:false,
      loadTips:false,
      page:1,
      pageSize:10,
      orderByField:'',
      enquiryList:[],
      selectType:'0',
      selectTypeName:'全部类型',
      optionsCustomer:[{
        label: '全部类型',
        value: '0',
      },
        {
          label: '保险公司',
          value: '3'
        },
        {
          label: '合约客户',
          value: '4'
        },
        {
          label: '散户',
          value: '5'
        },
        {
          label: '第三方',
          value: '1'
        }],
      selectTime:'0',
      optionsTimeSelect:[{
        label: '全部',
        value: '0',
      },{
        label: '催促',
        value: '10',
      },
        {
          label: '改派',
          value: '15'
        },],
      selectCancelType:'0',
      optionsCancelType:[{
        label: '全部',
        value: '0',
      },{
        label: '报修端',
        value: '1',
      },
        {
          label: '服务商',
          value: '2'
        },],

      demandSource:'',
      popupFilterShow:false,
      allotAttr:[],
      search:{
        applyCustomName:'',
        allotUserName:'',
        operatorId:'',
        carNo:'',
        remark:'',
        sn:'',
        timesDiff:0,
        timesLessDiff:'',
        timesLargeDiff:'',
      },
    }
  },
  /**进入路由前判断**/
  beforeRouteEnter (to, from, next) {
    next(vm => {
      if(from.query.stateId!==undefined){
      vm.selected=from.query.stateId;
    }else{
      vm.selected='0';
    }
  })
  },
  watch:{
    'selected'(val){
      this.page=1;
      Indicator.open({
        text: '加载中...',
        spinnerType: 'snake'
      });

      this.selectTime='0';
      this.search.timesDiff=0;
      this.search.timesLessDiff='';
      this.search.timesLargeDiff='';
      this.getCountFlag();
      //    获取接单列表
      var params = new URLSearchParams();
      params.append('countFlag',0);
      params.append('demandSource',this.demandSource);
      params.append('applyCustomName',this.search.applyCustomName);
      params.append('carNo',this.search.carNo);
      params.append('allotUserName',this.search.allotUserName);
      params.append('operatorId',this.search.operatorId);

      params.append('sn',this.search.sn);
      params.append('remark',this.search.remark);
      params.append('timesDiff',this.search.timesDiff);
      params.append('timesLessDiff',this.search.timesLessDiff);
      params.append('timesLargeDiff',this.search.timesLargeDiff);
      if(val=='0'){
        params.append('allotStatusMult','0,3,5');
        this.orderByField='modifyDate'
      }
      if(val=='1'){
        this.orderByField='allotDate'
        params.append('dateProp','allotDate');
      }
      if(val=='2'){
        this.orderByField='receiveDate'
        params.append('controllerCenterStatus',2);
      }
      if(val=='4'){
        this.orderByField='finishDate'
      }
      if(val=='6'){
        this.orderByField='cancelDate'
      }
      if(val=='7'){
        this.orderByField='cancelApplyDate'
        params.append('controllerCenterStatus',7);
      }
      params.append('allotStatus',val);
      params.append('currPage',this.page);
      params.append('pageSize',this.pageSize);
      params.append('orderByField',this.orderByField);

      this.$axios({
        method: 'post',
        url:'gp/declaration/listDemand',
        data:params
      }).then((res)=>{
        if(res.data.statusCode==200){
        Indicator.close();
        this.res = res.data.object;
        this.enquiryList = res.data.object.demands
        this.total=res.data.object.totalCount;
        if(this.enquiryList.length<=0){
          this.showNone=true;
        }else{
          this.showNone=false;
        }
      }else{
        Toast({
          message: res.data.message,
          position: 'middle',
          duration:800
        });
        Indicator.close();
      }
    });
    },

    'selectTime'(val){

      for(var i=0;i<this.optionsTimeSelect.length;i++){
        if(this.optionsTimeSelect[i].value==val){
          this.timeSelectStr=this.optionsTimeSelect[i].label
        }
      }

      if(val=='0'){
        this.search.timesDiff=0;
        this.search.timesLessDiff='';
        this.search.timesLargeDiff='';
      }else if(val=='10'){
        this.search.timesDiff=1;
        this.search.timesLessDiff=10;
        this.search.timesLargeDiff=15;
      }else if(val=='15'){
        this.search.timesDiff=1;
        this.search.timesLessDiff=15;
        this.search.timesLargeDiff='';
      }

      this.getCountFlag();

      this.page=1;
      var params = new URLSearchParams();
      params.append('countFlag',0);
      params.append('demandSource',this.demandSource);
      params.append('applyCustomName',this.search.applyCustomName);
      params.append('carNo',this.search.carNo);
      params.append('sn',this.search.sn);
      params.append('allotUserName',this.search.allotUserName);
      params.append('operatorId',this.search.operatorId);
      params.append('remark',this.search.remark);
      params.append('timesDiff',this.search.timesDiff);
      params.append('timesLessDiff',this.search.timesLessDiff);
      params.append('timesLargeDiff',this.search.timesLargeDiff);

      params.append('allotStatus',this.selected);
      if(this.selected=='0'){
        params.append('allotStatusMult','0,3,5');
        this.orderByField='modifyDate'
      }
      if(this.selected=='1'){
        this.orderByField='allotDate';
        params.append('dateProp','allotDate');
      }
      if(this.selected=='2'){
        this.orderByField='receiveDate'
        params.append('controllerCenterStatus',2);
      }
      if(this.selected=='4'){
        this.orderByField='finishDate'
      }
      if(this.selected=='6'){
        this.orderByField='cancelDate'
      }
      if(this.selected=='7'){
        params.append('controllerCenterStatus',7);
      }
      params.append('currPage',this.page);
      params.append('pageSize',this.pageSize);
      this.$axios({
        method: 'post',
        url:'gp/declaration/listDemand',
        data:params
      }).then((res)=>{
        console.log(res)
//      Toast({
//        message: '筛选成功',
//        position: 'middle',
//        duration:800
//      });
      this.popupFilterShow=false;
      this.res=res.data.object;
      this.enquiryList=res.data.object.demands;
      this.total=res.data.object.totalCount;
      if(this.enquiryList.length<=0){
        this.showNone=true;
      }else{
        this.showNone=false;
      }
    });
    }
  },
  created(){

    this.$axios({
      method: 'post',
      url:'gp/app/users/getAllotUserList',
    }).then((res)=> {
      console.log(res,1111);
    this.allotAttr=[];
    for(var i=0;i<res.data.object.length;i++){
      const item={
        name:res.data.object[i].name,
        id:res.data.object[i].id,
      }
      this.allotAttr.push(item)
    }

  });

    this.getCountFlag();
    if(this.$route.query.stateId){
      this.selected=this.$route.query.stateId;
    };
    if(this.$route.query.demandSource=='1'){
      this.demandSource=this.$route.query.demandSource;
      this.selectType='1';
      this.selectTypeName='第三方'
    }
    /** 获取接单列表 **/
  },
  methods:{

    getTime($timediff){
      const $days = Math.floor($timediff/(24*3600*1000));
      //计算小时数
      const leave1 = $timediff%(24*3600*1000);
      const $hours = Math.floor(leave1/(3600*1000));
      //计算分钟数
      const leave2 = leave1%(3600*1000);
      const $mins = Math.floor(leave2/(60*1000));
      //计算秒数
      const leave3 = leave2%(60*1000);
      const $secs = Math.floor(leave3/(1000));
      var $data='';
      if($days==0 && $hours==0 && $mins==0){
        $data=$mins+'分'+$secs+'秒';
      }else if($days==0 && $hours!=0){
        $data=$hours+'时'+$mins+'分';
      }else if($days==0 && $mins!=0){
        $data=$hours+'时'+$mins+'分';
      }else if($days!=0){
        $data=$days+'天'+$hours+'时'+$mins+'分';
      }
      return $data
    },
    loadMore() {
      if(this.total==0){
        return false;
      }
      if(this.enquiryList.length<this.total){
        this.loading = true;
        this.page++;
        var params = new URLSearchParams();
        params.append('countFlag',0);
        params.append('demandSource',this.demandSource);
        params.append('applyCustomName',this.search.applyCustomName);
        params.append('allotUserName',this.search.allotUserName);
        params.append('operatorId',this.search.operatorId);
        params.append('carNo',this.search.carNo);
        params.append('sn',this.search.sn);
        params.append('remark',this.search.remark);
        params.append('timesDiff',this.search.timesDiff);
        params.append('timesLessDiff',this.search.timesLessDiff);
        params.append('timesLargeDiff',this.search.timesLargeDiff);

        if(this.selected=='0'){
          params.append('allotStatusMult','0,3,5');
          this.orderByField='modifyDate'
        }
        if(this.selected=='1'){
          params.append('dateProp','allotDate');
          this.orderByField='allotDate'
        }
        if(this.selected=='2'){
          this.orderByField='receiveDate'
          params.append('controllerCenterStatus',2);
        }
        if(this.selected=='4'){
          this.orderByField='finishDate'
        }
        if(this.selected=='6'){
          this.orderByField='cancelDate'
        }
        if(this.selected=='7'){
          params.append('controllerCenterStatus',7);
        }
        params.append('allotStatus',this.selected);
        params.append('currPage',this.page);
        params.append('pageSize',this.pageSize);
        params.append('orderByField',this.orderByField);
        this.$axios({
          method: 'post',
          url:'gp/declaration/listDemand',
          data:params
        }).then((res)=> {
          for(var i=0;i<res.data.object.demands.length;i++){
          this.enquiryList.push(res.data.object.demands[i]);
        }
      });
        setTimeout(() => {
          this.loading = false;
      },1000);
      }else{
        this.loadTips=true;
      }

    },
    handleDetails(item){
      if(item.inquiryStatus==0 || item.inquiryStatus==1) {
        this.$router.push({path: '/platform-inquiry-details', query: {id: item.id, stateId: this.selected}})
      }else{
        this.$router.push({path: '/platform-report-details', query: {id: item.id, stateId: this.selected}})
      }
    },
    handleFilter(){
      this.popupFilterShow=true
    },
    getCountFlag(){
      this.page=1;
      var params = new URLSearchParams();
      params.append('countFlag',1);
      params.append('demandSource',this.demandSource);
      params.append('applyCustomName',this.search.applyCustomName);
      params.append('carNo',this.search.carNo);
      params.append('sn',this.search.sn);
      params.append('allotUserName',this.search.allotUserName);
      params.append('operatorId',this.search.operatorId);
      params.append('remark',this.search.remark);
      params.append('timesDiff',this.search.timesDiff);
      params.append('timesLessDiff',this.search.timesLessDiff);
      params.append('timesLargeDiff',this.search.timesLargeDiff);
      if(this.selected=='1'){
        params.append('dateProp','allotDate');
      }
      params.append('currPage',this.page);
      params.append('pageSize',this.pageSize);
      this.$axios({
        method: 'post',
        url:'gp/declaration/listDemand',
        data:params
      }).then((res)=>{
        if(res.data.statusCode==200){

        if(this.search.timesDiff==0){
          this.resCount = res.data.object;
        }else{
          this.resCount.sendCount=res.data.object.sendCount;
        }

      }else{
        Toast({
          message:res.data.message,
          position: 'middle',
          duration:800
        });
      }

    });
    },
    handleSure(){
      for(var i=0;i<this.optionsCustomer.length;i++){
        if(this.optionsCustomer[i].value==this.selectType){
          this.selectTypeName=this.optionsCustomer[i].label
        }
      }
      if(this.selectType=='0'){
        this.demandSource=''
      }else{
        this.demandSource=this.selectType
      }

      this.getCountFlag();
      this.page=1;
      var params = new URLSearchParams();
      params.append('countFlag',0);
      params.append('demandSource',this.demandSource);
      params.append('applyCustomName',this.search.applyCustomName);
      params.append('carNo',this.search.carNo);
      params.append('sn',this.search.sn);
      params.append('allotUserName',this.search.allotUserName);
      params.append('operatorId',this.search.operatorId);
      params.append('remark',this.search.remark);
      params.append('timesDiff',this.search.timesDiff);
      params.append('timesLessDiff',this.search.timesLessDiff);
      params.append('timesLargeDiff',this.search.timesLargeDiff);

      params.append('allotStatus',this.selected);
      if(this.selected=='0'){
        params.append('allotStatusMult','0,3,5');
        this.orderByField='modifyDate'
      }
      if(this.selected=='1'){
        this.orderByField='allotDate';
        params.append('dateProp','allotDate');
      }
      if(this.selected=='2'){
        this.orderByField='receiveDate'
        params.append('controllerCenterStatus',2);
      }
      if(this.selected=='4'){
        this.orderByField='finishDate'
      }
      if(this.selected=='6'){
        this.orderByField='cancelDate'
      }
      if(this.selected=='7'){
        params.append('controllerCenterStatus',7);
      }
      params.append('currPage',this.page);
      params.append('pageSize',this.pageSize);
      this.$axios({
        method: 'post',
        url:'gp/declaration/listDemand',
        data:params
      }).then((res)=>{
        console.log(res)
      Toast({
        message: '筛选成功',
        position: 'middle',
        duration:800
      });
      this.popupFilterShow=false;
      this.res=res.data.object;
      this.enquiryList=res.data.object.demands;
      this.total=res.data.object.totalCount;
    });
    }
  }
}
</script>

<style>

  .report-order-list .mint-tab-item-label .count{
    position: absolute;
    top: -8px;
    right:-14px;
    display: inline-block;
    width:14px;
    height: 14px;
    border-radius:50%;
    border:1px solid #c34853;
    font-size: 10px;
    letter-spacing:-1px;
    line-height: 16px;
    color:#c34853;
  }
  .report-order-list .mint-tab-item-label{
    position: relative;
    font-size:14px;
  }
  .report-order-list .mint-navbar .mint-tab-item{
    position: relative;
    padding:18px 0 16px;
  }
  .report-order-list .mint-navbar .mint-tab-item .tab-item-content{
    position: relative;
  }
  .report-order-list .mint-navbar .mint-tab-item.is-selected{
    color:#c34853;
    border-bottom:none;
  }
  .report-order-list .mint-navbar .mint-tab-item.is-selected{
    color:#c34853;
    border-bottom:none;
  }
  .report-order-list .mint-navbar .mint-tab-item.is-selected:after{
    background: #c34853;
    position: absolute;
    bottom:2px;
    left: 0;
    right: 0;
    height: 2px;
    content: '';
  }
  .report-order-list .mint-navbar .mint-tab-item.is-selected .mint-tab-item-label{
    font-size:15px;
  }
  .report-order-list .mint-tab-container{
    padding:12px 12px 0;
  }

  .report-order-list .xunjia-list{
    padding:15px;
  }

  .report-order-list .xunjia-list .item{
    background: #fff;
    padding:12px 16px 0;
    margin:0 0 16px;
    box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.05);
    border-radius:4px;
  }
  .report-order-list .xunjia-list .item-header{
    position: relative;
    padding:0 0 6px;
    font-size:15px;
    color: #333;
    font-weight: bold;
    border-bottom:1px solid #eee;
  }
  .report-order-list .xunjia-list .item-state{
    position: absolute;
    top: 0;
    right: 0;
  }
  .platform-report-list .xunjia-list .item-user-time{
    display: block;
    font-weight: normal;
    text-align: right;
  }
  .platform-report-list .xunjia-list .time-content{
    background:#bbb;
    display: inline-block;
    /*min-width:90px;*/
    padding:4px 6px 2px;
    color: #fff;
    font-size: 13px;
    border-radius:3px;
  }
  .platform-report-list .xunjia-list .time-content.time-content-warning{
    background:#f0ad4e;
  }
  .platform-report-list .xunjia-list .time-content.time-content-danger{
    background:#c34853;
  }
  .report-order-list .xunjia-list .item-body{
    margin: 0;
    padding:8px 0 6px;
    font-size:14.6px;
    color: #888;
  }
  .report-order-list .xunjia-list .item-body dd{
    margin: 0 0 5px;
    line-height:19px;
  }
  .report-order-list .xunjia-list .item-footer{
    border-top:1px solid #ddd;
    margin:0 -16px;
  }
  .report-order-list .xunjia-list .item-footer .mint-button{
    background:none;
    display: block;
    width: 100%;
    height:46px;
    border-radius:0;
    font-size: 16px;
    color:#c34853
  }
  .report-order-list .xunjia-list .item-footer .mint-button:after{
    background:none;
  }
  .report-order-list .push-order-list .mint-navbar{
    border-bottom:1px solid #ddd;
  }
  .report-order-list .item-sn{
    padding:4px 0 0;
    font-size: 13px;
    font-weight:normal;
    color: #999;
  }
  .report-order-list .icon-didian1{
    font-weight: bold;
    margin-right:4px;
  }
  .report-order-list .item-addon{
    color: #666;
  }

  .report-order-list .load-finish-tips{
    padding:4px 0 16px;
    font-size: 14px;
    color:#666;
    text-align: center;
  }
  .report-order-list .load-finish-tips:before{
    display: inline-block;
    vertical-align: middle;
    width:40px;
    height: 1px;
    background-color: #bbb;
    content: '';
    margin-right:6px;
  }
  .report-order-list .load-finish-tips:after{
    display: inline-block;
    vertical-align: middle;
    width:40px;
    height: 1px;
    background-color: #bbb;
    content: '';
    margin-left:6px;
  }
  .report-order-list .module-none{
    padding:36px 0 0;
    font-size: 20px;
    text-align: center;
    color:#999;
  }
  .report-order-list .app-header{
    background: #fff;
    font-size: 14.6px;
    padding:6px 10px;
    border-bottom:1px solid #ddd;
    overflow: hidden;
  }
  .report-order-list .type-content{
    color: #c34853;
  }
  .report-order-list .type-show{
    line-height: 38px;
  }
  .report-order-list .btn-filter{
    float: right;
    padding:8px 16px;
    height:auto;
    font-size: 14px;
  }
  .report-order-list .filter-popup{
    height: 100%;
    width:90%;
    padding:0 0 24px;
    font-size: 14px;
    overflow: auto;
  }
  /*.report-order-list .filter-item{*/
    /*border-bottom:1px solid #ddd;*/
  /*}*/
  .report-order-list .filter-list .addon{
    display: block;
    padding:12px 12px 0;
    /*border-bottom:1px solid #ddd;*/
  }
  .report-order-list .filter-list .addon:before{
    background:#c34853;
    position: relative;
    top:-2px;
    display:inline-block;
    vertical-align: middle;
    width:4px;
    height:16px;
    content: '';
    margin-right:5px;
  }

  .platform-report-list .mint-radiolist .mint-cell{
    min-height:42px;
    width:50%;
    display: inline-block;
    vertical-align: middle;
  }
  .platform-report-list .mint-radiolist .mint-cell-wrapper{
    background:none;
    font-size: 14px;
  }
  .platform-report-list .mint-radiolist .mint-cell:last-child{
    background:none;
  }
  .report-order-list .filter-popup .button-content{
    padding:24px 10px 0;
    text-align: center;
    font-size: 0;
  }
  .report-order-list .filter-popup .button-block-6{
    display: inline-block;
    width: 50%;
    padding:0 10px;
  }
  .report-order-list .filter-popup .button-content .mint-button{
    display: inline-block !important;
    width: 100%;
    font-size: 15px;
  }

  .report-order-list .filter-item-spe .mint-cell-value{
    width:70%;
    min-height:36px;
    padding:4px 8px;
    border:1px solid #ddd;
    border-radius:6px
  }
  .report-order-list .filter-item-spe{
    border-bottom:none
  }
  .platform-report-list .filter-item-select .mint-cell-value{
    padding:0 8px;
  }
  .platform-report-list .filter-item-select .select-operator{
    width: 100%;
    min-height:32px;
    border:none;
    outline:none;
  }
  .report-order-list .filter-item-spe .mint-cell-wrapper{
    background:none;
    font-size: 14px;
  }
  .report-order-list .filter-item-spe .mint-cell:last-child{
    background:none;
  }
  .platform-report-list .app-main{
    padding:98px 0 0;
  }
  .platform-report-list .mint-navbar{
    overflow-x: auto;
    overflow-y: hidden;
  }
  .platform-report-list .mint-navbar .mint-tab-item{
    width:18% !important;
    min-width:18%;
    max-width:18%;
  }
  .report-order-list .count-tips{
    position: relative;
    top: -4px;
    font-size: 14px;
  }
  .platform-report-list .block-time-select{
    background: #fff;
    margin:0 0 14px;
  }
  .platform-report-list .block-time-select .mint-cell{
    width: 33.2%;
  }
  .platform-report-list .block-time-select .mint-radiolist-title{
    margin: 0;
  }
</style>
